<ion-header>
  <ion-toolbar>
    <ion-buttons slot="start">
      <ion-menu-button></ion-menu-button>
    </ion-buttons>
    <ion-title>Signup</ion-title>
  </ion-toolbar>
</ion-header>

<ion-content>
  <div class="signup-logo">
    <img src="assets/img/appicon.svg" alt="Ionic Logo" />
  </div>

  <div class="signup-form">
    <form #signupForm="ngForm" novalidate>
      <ion-input
        label="Username"
        labelPlacement="stacked"
        fill="solid"
        [(ngModel)]="signup.username"
        name="username"
        type="text"
        #username="ngModel"
        errorText="Username is required"
        required
      >
      </ion-input>

      <ion-input
        label="Password"
        labelPlacement="stacked"
        fill="solid"
        [(ngModel)]="signup.password"
        name="password"
        type="password"
        #password="ngModel"
        errorText="Password is required"
        required
      >
      </ion-input>

      <ion-row>
        <ion-col>
          <ion-button (click)="onSignup(signupForm)" type="submit" expand="block"
          >Create</ion-button
        >
        </ion-col>
      </ion-row>
    </form>
  </div>
</ion-content>
